/**
 * Created by ren on 05/04/2017.
 */
'use strict';
import React, {Component} from 'react';
import {Platform, View, Text, StatusBar} from 'react-native';
import {getSize} from '../utils/response'
import ScrollableTabView, {DefaultTabBar}  from 'react-native-scrollable-tab-view';
import {Header,Left,Title,Right,Button,Body,Tabs,Tab} from 'native-base'
import {connect} from 'react-redux'
import VFooter from '../components/Footer'
import NotSend from './order/NotSend'
import Sending from './order/Sending'
import SendEnd from './order/SendEnd'
class Order extends Component {
  // 构造
  constructor(props) {
    super(props);
    // 初始状态
    this.state = {
      initialPage: 0,
      activePage: 0
    };
  }

  onChangeTab(index) {
    this.setState({
      activePage: index['i']
    })
  }

  render() {
    return (
      <View style={{flex:1,backgroundColor:'#F4F4F4'}}>
        <Header iosBarStyle="light-content" backgroundColor="#16BD42" style={{backgroundColor:'#16BD42',height:Platform.OS==='ios'?getSize(64):getSize(50),marginBottom:getSize(7)}}>
          <StatusBar
            backgroundColor={'#303135'}
          />
          <Body style={{alignItems:'center'}}>
          <Title style={{color:'white',fontSize:getSize(19)}}>我的订单</Title>
          </Body>
        </Header>
        {<ScrollableTabView
          locked={false}
          initialPage={0}
          scrollWithoutAnimation={false}
          renderTabBar={() => <DefaultTabBar style={{height:getSize(37),paddingTop:getSize(5)}}/>}
          tabBarUnderlineStyle={{backgroundColor: '#1BAB41',height:1}}
          tabBarBackgroundColor='#FFFFFF'
          tabBarActiveTextColor='#00A22B'
          tabBarInactiveTextColor='#9A9A9A'
          tabBarTextStyle={{fontSize: getSize(16),fontWeight:'200'}}
        >
          <View tabLabel="待配送" style={{flex:1,paddingTop:getSize(10)}}>
            <NotSend/>
          </View>
          <View tabLabel="配送中" style={{flex:1,paddingTop:getSize(10)}}>
            <Sending/>
          </View>
          <View tabLabel="配送完成" style={{flex:1,paddingTop:getSize(10)}}>
            <SendEnd/>
          </View>
        </ScrollableTabView>}
        <VFooter/>
      </View>
    );
  }
}
function select(store) {
  return {
    title: store.routesStore.cutTab,
  }
}
export default connect(select)(Order)